<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8" %>
<%@ include file="inc/taglibs.jsp" %>
<!DOCTYPE html>
<html lang="zh-cn">
<head>
    <%@ include file="inc/meta.jsp" %>
    <meta name="description" content="">
    <meta name="author" content="">
    <title>添加评论</title>
    <%@ include file="inc/css.jsp" %>
</head>
<body>

<div id="posts" class="wrapper">

    <%@ include file="inc/nav.jsp" %>

    <div id="page-wrapper">
        <div class="row">
            <div class="col-lg-12">
                <c:if test="${type == 0}"><h1 class="page-header">信件列表</h1></c:if>
                <c:if test="${type == 1}"><h1 class="page-header">一言列表</h1></c:if>
                <c:if test="${type == 2}"><h1 class="page-header">微音列表</h1></c:if>
                <c:if test="${type == 3}"><h1 class="page-header">心事列表</h1></c:if>
                <c:if test="${type == 4}"><h1 class="page-header">草丛列表</h1></c:if>
                <c:if test="${type == 7}"><h1 class="page-header">推送列表</h1></c:if>
                <h4 style="margin-left: 10px;">——添加评论</h4>
            </div>
        </div>

        <div class="row">
            <div class="col-lg-12">
                <div class="panel panel-default">
                    <!-- /.panel-heading -->
                    <div class="panel-body">
                        <form id="infoForm" method="post" action="common/comment/save" class="form-horizontal nice-validator n-default" role="form" novalidate="novalidate">
                            <input type="hidden" id="tempCommentSourceId" name="sourceId" value="${sourceId}"/>
                            <input type="hidden" id="tempCommentType" name="type" value="${type}"/>
                            <span id="tempAddImageIds" style="display: none"></span>
                            <span id="tempDelImageIds" style="display: none"></span>

                            <div class="form-group">
                                <label class="col-sm-2 control-label">内容:</label>
                                <div class="col-sm-6" style="padding-top: 6.5px">
                                    <textarea cols="40" rows="8" class="form-control" id="content" style="resize: none" name="content" maxlength="2000" placeholder="评论内容，最多2000字"></textarea>
                                </div>
                            </div>

                            <div class="form-group">
                                <label class="col-sm-2 control-label">图片:</label>
                                <div class="col-sm-10" style="padding-top: 6.5px">
                                    <div style="float: left;margin-bottom: 30px;" id="lastImageDiv">
                                        <a href="javascript:void(0);" onclick="AddTempImg()">
                                            <img id="tempPicture" src="static/images/add.jpg" style="height: 200px; width: 200px; display: inherit; margin-bottom: 6px;" border="1"/>
                                        </a>
                                    </div>
                                </div>
                            </div>

                            <div class="form-group">
                                <div class="col-sm-12" style="text-align: center">
                                    <button type="button" class="btn btn-primary" onclick="subCommentInfo()">确定添加</button>
                                    <a href="javascript:void(0)" onclick="commentGoBack()" class="btn btn-primary" role="button">返回</a>
                                </div>
                            </div>
                        </form>

                        <form id="tempImageForm" method="post" action="common/addTempImage" enctype="multipart/form-data" class="form-horizontal" role="form">
                            <input type="file" name="tempImage" id="tempImage" data-rule="required" style="display:none;" onchange="saveTempImage()"/>
                        </form>

                        <div id="tempDiv" style="display:none;float: left; height: 210px;width: 200px;margin-right:6px; z-index: 0;margin-bottom: 120px;">
                            <img class="imgs" alt="" src="" style="height: 200px;width: 200px; z-index: 1;"/>
                            <input name="imageIdTemp" type="hidden"/>
                            <a href="javascript:void(0);" style="float: none; z-index: 10; position: relative; bottom: 204px; left: 184px; display: none;" class="axx" onclick="deleteImage(this)">
                                <img id="pic" src="static/images/xx.png" style="height: 16px; width: 16px; display: inline;" border="1"/>
                            </a>
                        </div>
                    </div>
                    <!-- /.panel-body -->

                </div>
            </div>
        </div>

    </div>
    <!-- /#page-wrapper -->

</div>
<!-- /#wrapper -->

<%@ include file="inc/footer.jsp" %>

</body>

<script type="text/javascript">
    var imageSize = 0;

    function subCommentInfo() {
        var flag = true;
        var content = $('#content').val();

        if (null == content || content == '') {
            $leoman.notify('评论内容不能为空', "error");
            flag = false;
            return;
        }

        // 所有的验证通过后，执行新增操作
        if (flag) {
            $("#infoForm").ajaxSubmit({
                url: _basePath + "common/comment/save",
                dataType: "json",
                data: {
                    "tempAddImageIds": $("#tempAddImageIds").html(),
                    "tempDelImageIds": $("#tempDelImageIds").html()
                },
                success: function (data) {
                    if (data == 1) {
                        commentGoBack();
                    } else {
                        $leoman.notify("操作失败", "error");
                    }
                }
            });
        }
    }

    function AddTempImg() {
        // a标签绑定onclick事件
        $('#tempImage').click();
    }

    function insertImage(path, id) {
        $('#tempPicture').prop('src', "static/images/add.jpg");

        var tempDiv = $("#tempDiv").clone();
        tempDiv.prop('id', '');
        tempDiv.css("display", "block");
        tempDiv.children(":first").prop("src", path);
        tempDiv.children(":first").next().prop("value", id);

        tempDiv.insertBefore("#lastImageDiv");

        // 让所有的克隆出来的
        tempDiv.hover(function () {
            mouseover($(this));
        }, function () {
            mouseOut($(this));
        });
    }

    function mouseover(mouse) {
        $(mouse).children("a").fadeIn(300);
    }

    function mouseOut(mouse) {
        $(mouse).children("a").fadeOut(300);
    }

    function saveTempImage() {
        $("#infoReduceDialogModal").modal("show");
        $("#tempImageForm").ajaxSubmit({
            dataType: "json",
            success: function (data) {
                $('#infoReduceDialogModal').modal("hide");
                if (null != data && null != data.url && data.url != '') {
                    $('#tempAddImageIds').html($('#tempAddImageIds').html() + data.id + ',');
                    insertImage(data.url, data.id);
                } else {
                    $leoman.notify("图片格式不正确", "error");
                }
            }
        });
    }

    function deleteImage(self) {
        imageSize = imageSize - 1;
        var imageId = $(self).prev().val();
        $('#tempDelImageIds').html($('#tempDelImageIds').html() + imageId + ',');
        $(self).parent().remove();
    }

    function commentGoBack() {
        var sourceId = $('#tempCommentSourceId').val();
        var type = $('#tempCommentType').val();

        switch (Number(type)) {
            case 0:
                // 信件
                if (null == sourceId || sourceId == '') {
                    window.location.href = 'backend/letter/index';
                } else {
                    window.location.href = 'backend/letter/add?letterId=' + sourceId;
                }
                break;
            case 1:
                // 纸条
                if (null == sourceId || sourceId == '') {
                    window.location.href = 'backend/paper/index';
                } else {
                    window.location.href = 'backend/paper/add?paperId=' + sourceId;
                }
                break;
            case 2:
                // 广播
                if (null == sourceId || sourceId == '') {
                    window.location.href = 'backend/broadcast/index';
                } else {
                    window.location.href = 'backend/broadcast/add?broadcastId=' + sourceId;
                }
                break;
            case 3:
                // 心事
                if (null == sourceId || sourceId == '') {
                    window.location.href = 'backend/mind/index';
                } else {
                    window.location.href = 'backend/mind/add?mindId=' + sourceId;
                }
                break;
            case 4:
                // 兴趣圈
                if (null == sourceId || sourceId == '') {
                    window.location.href = 'backend/circle/index';
                } else {
                    window.location.href = 'backend/circle/add?circleId=' + sourceId;
                }
                break;
            case 7:
                // 推送（公告）
                if (null == sourceId || sourceId == '') {
                    window.location.href = 'backend/placard/index';
                } else {
                    window.location.href = 'backend/placard/add?placardId=' + sourceId;
                }
                break;
        }
    }
</script>

</html>